<app>
    <window reload="mainWindow">
        <attr-id v="mainWindow" />
        <attr-full v="0" />
        <attr-minWidth v="{{ (desktop.width() * 2 / 3) | round | int }}" />
        <attr-minHeight v="{{ (desktop.height() * 2 / 3) | round | int }}" />
        <attr-maxWidth v="{{ desktop.width() }}" />
        <attr-maxHeight v="{{ desktop.height() }}" />
        <attr-title ob="spacing" format="Grid Spacing: %d" />
        <attr-pos ob="pos" />

        <frame>
            <attr-width v="500" />
            <attr-height v="500" />
            <grid>
                <attr-spacing ob="spacing" />
                <row>
                    <col>
                        <hbox>
                            <vbox>
                                <button>
                                    <attr-repeat v="1" />
                                    <attr-text ob="spacing" format="Spacing %d, +1" />
                                    <event-clicked v="addSpacing" />
                                    按钮1
                                </button>
                            </vbox>
                            <frame><attr-shape v='vline' /></frame>
                        </hbox>
                    </col>
                    <col>
                        <button>
                            <attr-text ob="spacing" format="Spacing %d, -1" />
                            <attr-enable ob="spacing1" />
                            <event-clicked v="downSpacing" />
                            按钮2
                        </button>
                    </col>
                    <col>
                        <vbox>
                            <button>
                                <attr-visible ob="!tipShow" />
                                <event-clicked v="showTips" />
                                Show Tips
                            </button>
                            <button>
                                <attr-visible ob="tipShow" />
                                <event-clicked v="showTips" />
                                Close Tips
                            </button>
                        </vbox>
                    </col>
                </row>
                <row>
                    <button-group>
                        <attr-gid v="1" />
                        <attr-checked ob="@isDown" />{#@代表双向绑定，radio状态改变会触发isDown值的变化，isDown值的改变会触发radio状态改变#}
                        <col>
                            <attr-offset v="2" />
                            <hbox>
                                <radio><attr-gid v="1" />升</radio>
                                <radio><attr-gid v="1" />降</radio>
                            </hbox>
                        </col>
                    </button-group>
                </row>
                <row>
                    <col>
                        <attr-span v="2" />
                        <label><attr-text ob='spacing' format='Label Spacing: %d' />Label 1</label>
                    </col>
                    <col>
                        <hbox>
                            <select>
                                <attr-index ob="selectIndex" />
                                {# <event-highlighted v="highlight" param="int" /> #}
                                <event-currentIndexChanged v="change" param="int" />
                                <option>a</option>
                                <option>b</option>
                                <option>c</option>
                            </select>
                            <label><attr-text ob="selectIndex" /></label>
                        </hbox>
                    </col>
                </row>
                <row>
                    <col>
                        <attr-span v="3" />
                        {% include "tab.jinja2" %}
                    </col>
                </row>
                <row>
                    <col>
                        <button>
                            <event-clicked v="testSignal" />
                            测试多线程
                        </button>
                    </col>
                </row>
                <row>
                    <col>
                        <attr-span v="3" />
                        <status>
                            <attr-msg v="测试" />
                        </status>
                    </col>
                </row>
            </grid>
        </frame>
    </window>

    <widget>
        <attr-full v="1" />
        <attr-width v="500" />
        <attr-height v="100" />
        <attr-visible ob="tipShow" />
        <frame>
            <hbox>
                <label><attr-text ob="spacing" format="Grid Spacing: %d" /></label>
            </hbox>
        </frame>
    </widget>
</app>